<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>悠U</title>
    <!-- 引入bootstrap框架的样式文件 -->
    <link rel="stylesheet" href="../../plugins/bootstrap/css/bootstrap.css" type="text/css">
    <!-- 引入外部的css样式 -->
    <link rel="stylesheet" href="../../plugins/bootstrap/css/animate.css" type="text/css">
    <link rel="stylesheet" href="../../plugins/bootstrap/css/font-awesome.css?v=4.4.0" type="text/css">
    <link href="../../plugins/bootstrap/css/style.css?v=4.1.0" rel="stylesheet" type="text/css">
    <!-- 引用自己写的css样式 -->
    <link href="../../css/index/index.css" rel="stylesheet" type="text/css">

    <!-- 滚动显示相关游记 -->
    <link rel="stylesheet" href="../../css/note/jq22.css" type="text/css" />
    <script src="http://www.jq22.com/jquery/jquery-1.10.2.js"></script>
    <!-- <script src="../../js/note/jquery-latest.pack.js" type="text/javascript"></script> -->

    <!-- 评论 -->
    <link rel="stylesheet" href="../../css/note/comment/comment.css">
    <link rel="stylesheet" href="../../css/note/comment/style.css">


    <style>
        #author-headerImg {
            width: 120px;
            height: 120px;
            padding: 0px;
        }

        #author-crown {
            width: 28px;
            height: 28px;
            padding: 0px;
        }

        .per_name {
            color: #ff7200;
            font-size: 14px;
            font-weight: normal;
        }

        .btn_sfollow {
            width: 28px;
            height: 13px;
            padding: 0px;
        }

        .context p {
            font-size: 15px;
            color: black;
        }

        .dir_list ul li {
            font-size: 16px;
            background: url(../../imgs/note/sprite1.png) no-repeat;
            cursor: pointer;
        }

        .dir_list ul li.time {
            background-position: -22px 0;
        }

        .dir_list ul li.day {
            background-position: -22px -22px;
        }

        .dir_list ul li.people {
            background-position: -22px -44px;
        }

        .dir_list ul li.cost {
            background-position: -22px -66px;
        }

        .dir_list ul li span {
            color: #ff7200;
        }

        /* 侧导航 */
        #sideul li {
            list-style: none;
            color: black;
            width: 100%;
            height: 1.8em;
            font-size: 1.5em;
            text-align: center;
        }

        a {
            text-decoration: none;
        }

        .ce-nav {
            position: fixed;
            top: 600px;
            right: 100px;
        }
    </style>
</head>

<body>
    <div class="container-fluid" id="head" style="margin-bottom: 0px;">
        <div class="row">

            <nav class="navbar" role="navigation"
                style="background-color: rgb(206, 228, 247);padding-left: 100px;margin-bottom: 0px">
                <div class="container-fluid">
                    <div>
                        <button type="button" class="navbar-toggle" data-toggle="collapse"
                            data-target="#example-navbar-collapse" style="background-color: royalblue">
                            <span class="sr-only">切换导航</span>
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                        </button>
                        <a href="index.html"> <img src="../../imgs/index/logo.jpg" alt="失败" id="logo"
                                class="img-circle navbar-brand"></a>
                        <a class="navbar-brand" href="index.html" style="padding-left: 0px;font-family:楷体">
                            <span data-toggle="tooltip" title="悠 U 新方式">
                                悠&nbsp;U</span></a>
                    </div>

                    <div class="collapse navbar-collapse" id="example-navbar-collapse ">
                        <ul class="nav navbar-nav ">
                            <li><a href="index.html">
                                    <span style="padding:0px 20px" data-toggle="tooltip" title="首页"> 首页</span></a></li>

                            <li class="dropdown">
                                <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                                    游记<b class="caret"></b>
                                </a>
                                <ul class="dropdown-menu">
                                    <li><a href="#">
                                            <span class="glyphicon glyphicon-user"
                                                style="text-shadow: rgb(216, 206, 206) 3px -1px;"></span>
                                            &nbsp;达人
                                            <span class="badge pull-center" style="background-color: red">hot</span>
                                        </a></li><br>
                                    <li><a href="#">
                                            <span class="glyphicon glyphicon-edit"></span>
                                            写游记
                                            <span class="badge pull-center"
                                                style="background-color: red;font-size:3px">赚钻石</span>
                                        </a></li><br>
                                    <li><a href="#">
                                            <span class="glyphicon glyphicon-flag"></span>
                                            游记主页</a></li><br>
                                </ul>
                            </li>
                            <li class="dropdown">
                                <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                                    景点<b class="caret"></b>
                                    <!-- <span class="label label-danger" style="font-size: 1px;">NEW</span>-->
                                </a>
                                <ul class="dropdown-menu">
                                    <li><a href="#"><span class="glyphicon glyphicon-fire">&nbsp;主题景点</span>
                                            <span class="badge pull-center"
                                                style="background-color: red;font-size:3px">NEW</span>
                                        </a></li><br>
                                    <li><a href="#"><span class="glyphicon glyphicon-plane">&nbsp;精品行程</span></a></li>
                                    <br>
                                    <li><a href="#"><span class="glyphicon glyphicon-bell">&nbsp;当地玩乐</span></a></li>
                                </ul>
                            </li>
                            <li>
                                <a href="#">
                                    <span data-toggle="tooltip" title="导&nbsp;游">导游</span>
                                    <!-- <span class="badge pull-center"
                                        style="color: red;font-size:1px">hot</span> -->
                                </a>
                            </li>

                        </ul>

                        <!-- <div style="padding-top:15px" class="">
                                <input type="text" placeholder="用户/游戏/动态" style=" height:20px">
                                
                            </div> -->


                        <ul class="nav navbar-nav navbar-right" style="padding-right: 100px">

                            <li class="dropdown">
                            <li> <a></a></li>
                            <li><a href="#" class="dropdown-toggle" data-toggle="dropdown"
                                    style="font-family: 楷体;padding-left: 0px">
                                    我的悠 U &nbsp;<img id="headerImg" src="../../imgs/index/head.jpg"
                                        class="img-circle"><b class="caret"></b>
                                </a>
                                <ul class="dropdown-menu">
                                    <li>
                                        <a href="#">我的订单</a>
                                    </li>
                                    <li>
                                        <a href="#">我的导游</a>
                                    </li>
                                    <li>
                                        <a href="#">我的钱包</a>
                                    </li>

                                    <li>
                                        <a href="#">我的游记</a>
                                    </li>
                                    <li class="divider"></li>
                                    <li> <a href="#">互动信息</a> </li>
                                    <li> <a href="#">我的账号</a> </li>
                                    <li> <a href="#">退出</a> </li>

                                </ul>
                            </li>
                            <li><a href="#weibo" style="padding-left:2px;padding-right: 2px"><i
                                        class="fa fa-weibo"></i></a></li>
                            <li><a href="#weixin" style="padding-left:2px;padding-right: 2px"><i
                                        class="fa fa-weixin"></i> </a></li>
                            <li><a href="#weixin" style="padding-left:2px;padding-right: 2px"> <i
                                        class="fa fa-qq"></i></a></li>
                            <li><a href="" style="padding-left:10px;padding-right: 10px">登录</li> </a>
                            <li><a href="" style="padding-left:10px;padding-right: 10px">注册</li> </a>



                        </ul>
                    </div>
                </div>
            </nav>
        </div>
    </div>

    <!-- 主图片 begin -->
    <div class="container-fluid">
        <div class="row">
            <div">
                <img src="https://n4-q.mafengwo.net/s14/M00/91/FD/wKgE2l1LzCyAajgLAAg-9Chwsso49.jpeg?imageMogr2%2Fstrip"
                    style="height: 506px;width: 100%">
                <div style="position:absolute;width: 100%;height:90px;z-index:1;left:0%;top:470px;">
                    <div
                        style="position:relative;width:710px;height:80px;z-index:1;left:380px;top:0%;padding-top: 20px;">
                        <font size="5px" color="white"><b>这里是文章的标题,是有固定长度的</b></font>
                    </div>
                    <div
                        style="position:absolute;width: 90px;;height:80px;z-index:3;left:1090px;top:0;text-align: center">
                        <img src="../../imgs/note/fabulous.gif" style="height: 50px;width: 50px"><br>
                        <font size="2px" color="white"><b>66666</b></font>
                    </div>


                </div>
        </div>



    </div>


    </div>

    <!-- 主图片 end -->

    <div class="container-fluid">
        <div class="row">
            <div class="note-author" style="height:35px;box-shadow: 0px 0px 5px gray;">
                <div style="position:relative;width: 120px;;height:120px;z-index:2;left:225px;top:-90px;">
                    <a href="../../views/traveler/travlerinfo.html"><img id="author-headerImg" class="img-circle"
                            src="https://n4-q.mafengwo.net/s14/M00/91/FD/wKgE2l1LzCyAajgLAAg-9Chwsso49.jpeg?imageMogr2%2Fstrip"></a>
                    <div style="position:absolute;width: 33px;;height:33px;z-index:2;left:74%;top:78%;">
                        <img id="author-crown" class="img-circle" src="../../imgs/note/crown.jpg">
                    </div>
                </div>
                <div
                    style="position:relative;width: 500px;;height:33px;z-index:2;left:380px;top:-118px;padding-top: 10px">
                    <a href="../../views/traveler/travlerinfo.html" target="_blank" class="per_name"
                        title="大帅哥">大帅哥&nbsp;(苏州)</a>
                    <a href="#" target="_blank">&nbsp;&nbsp;<img class="btn_sfollow"
                            src="../../imgs/note/btn_sfollow.gif"></a>
                    &nbsp;&nbsp;&nbsp;&nbsp;<font size="2px" color="gray"><b>2019-08-18 &nbsp;21:02</b></font>
                    &nbsp;&nbsp;&nbsp;&nbsp;<a href="#"></a><span class="glyphicon glyphicon-star-empty"
                        aria-hidden="true" style="size: 20px;">收藏</span></a>
                    &nbsp;&nbsp;&nbsp;&nbsp; <a href="#comment"><i class="fa fa-commenting-o"></i>评论</a>
                    &nbsp;&nbsp;&nbsp;&nbsp;<span class="glyphicon glyphicon-eye-open" aria-hidden="true">666</span>
                </div>
            </div>
        </div>
    </div>


    <!-- 文章主体 -->
    <div class="container-fluid" style="margin-top:20px;width: 1000px;padding-top:20px;">
        <div class="row">
            <div class="left" style="width: 70%;float: left;">
                <div class="context-head"
                    style="width: 100%;height:80px;border:1px dashed rgb(214, 200, 200);float: left;">
                    <div class="col-md-5 dir_list" style="height: 40px;padding-top: 10px;">
                        <ul>
                            <li class="time">
                                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;出发时间&nbsp;<span>/</span>&nbsp;2019-08-20<i></i></li>

                        </ul>
                    </div>
                    <div class="col-md-3 dir_list" style="height: 40px;padding-top: 10px;">
                        <ul>
                            <li class="day">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;出行天数&nbsp;<span>/</span>&nbsp;2天<i></i>
                            </li>

                        </ul>
                    </div>
                    <div class="col-md-3 dir_list" style="height: 40px;padding-top: 10px;">
                        <ul>
                            <li class="people">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;伙伴&nbsp;<span>/</span>&nbsp;朋友<i></i>
                            </li>

                        </ul>
                    </div>
                    <div class="col-md-4 dir_list" style="height: 40px;padding-top: 10px;">
                        <ul>
                            <li class="cost">
                                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;人均费用&nbsp;<span>/</span>&nbsp;10000RMB<i></i></li>

                        </ul>
                    </div>

                </div>

                <div class="context" style="margin-top:100px;padding-right:30px; ">
                    <h2 id="01"><b>出发！目的地：神秘中东古国以色列</b></h2>
                    <hr>
                    <p>提到 以色列 ，总会和几个关键词联系在一起——古老、宗教、战争、保守。</p>
                    <p>印象中的 以色列 ，总是带着灰暗的色调，正如全身包裹着纱巾的阿拉伯人，充满未知的神秘。</p>
                    <p>当地人有一句俗语，“活在 特拉维夫 ，死在 耶路撒冷 ”，这是他们最理想的一生。</p>
                    <p>特拉维夫 全称是 特拉维夫 ·雅法，由雅法古城和以古城为核心发展起来的 特拉维夫 新城 组成。 特拉维夫</p>
                    <p> 在希伯来语中的意思是“春天的小丘”，象征着万物复苏，承载着希望。这样一座“春天”之城，究竟为何如此让人眷恋在这里生活？而宗教之城 耶路撒冷 ，一直出现在各 大新</p>
                    <p>闻国际版，是否一如报道那样冲突不断？
                        <p>而对于孩子来说， 以色列 处处都是课堂，这座历史、宗教、艺术的宝库，能带给孩子怎样的体验？借这次10天7晚 以色列 亲子夏令营， 中东 古国探秘之旅就此开启——</p>
                        <br>
                        <p>君君的行程预告&旅行tips</p>
                        <p>这是一篇迟到的游记，在暑假之初便带龙龙参加了这次 以色列 10天7晚亲子夏令营，从 上海</p>
                        <p>直飞航程约11个半小时，在路上便耗费大半天的时间，除去头尾两天在路上，共8天的行程，游览了许多经典景区，感受当地独特的人文，来一波预告片先睹为快吧：</p>
                        <br>
                        <p>Day1： 上海 -- 特拉维夫 ： 凯撒利亚 国家公园，Beit Lechem HagliIit农场， 以色列 童子军</p>
                        <p>Day2： 特拉维夫 --提比利亚： 海法 空中花园，Mad-Tech Fab-Lab， 拿撒勒 古村落</p>
                        <p>Day3：提比利亚： 萨法德 艺术小镇，加利利湖，八福山</p>
                        <p>Day4：提比利亚-- 耶路撒冷 ： 死海 ，马萨达</p>
                        <p>Day5： 耶路撒冷 ：橄榄山，大卫塔历史博物馆，巴以隔离墙，大卫塔•夜之炫</p>
                        <p>Day6： 耶路撒冷 ： 耶路撒冷 圣殿山， 以色列 博物馆，哭墙</p>
                        <p>Day7： 特拉维夫 ：葡萄籽工厂，家庭财富管理课程， 特拉维夫 钻交所，雅法古城， 海法</p>
                        <p>海滩</p>
                    </p>
                    <p>Day8： 特拉维夫 -- 上海 ：艺术与科学学院</p>
                    <br>
                    <img src="../../imgs/travler/dis_ati2.jpg"><br>
                    &nbsp;&nbsp;&nbsp;<font size="2px" color="gray">凯撒利亚</font><br><br>
                    <img src="../../imgs/travler/dis_ati2.jpg"><br>
                    &nbsp;&nbsp;&nbsp;<font size="2px" color="gray">凯撒利亚</font><br><br>
                    <img src="../../imgs/travler/dis_ati2.jpg"><br>
                    &nbsp;&nbsp;&nbsp;<font size="2px" color="gray">凯撒利亚</font><br><br>
                    <img src="../../imgs/travler/dis_ati2.jpg"><br>
                    &nbsp;&nbsp;&nbsp;<font size="2px" color="gray">凯撒利亚</font><br><br>
                    <br>
                    <p> 关于航班</p><br>
                    <p> 这次夏令营包机，因为考虑到孩子的休息，晚上十点多钟到机场，两点多起飞，在飞机上可以直接睡一觉。当地时间比</p><br>
                    <p> 北京</p><br>
                    <p> 时间晚5个小时左右，所以睡一觉醒来，到达</p><br>
                    <p> 特拉维夫 才上午八点左右。目前 上海 、</p><br>

                    <h2 id="02"> <b>Day1：学在旅途！古城风情体验之旅</b></h2>
                    <p>行程： 上海 -- 特拉维夫 （ 凯撒利亚 国家公园，Beit Lechem HagliIit农场， 以色列 童子军）</p><br>
                    <br>
                    <p></p>★ 第一站： 凯撒利亚 国家公园</p><br>
                    <p> 十一个多小时的航程，基本在梦中度过。一觉醒来，便即将降落在本古里 安国 际机场。</p><br>
                    <p>一行人办理完手续，集结完毕，便向着此行第一站—— 凯撒利亚 国家公园出发。</p><br>

                    <img src="../../imgs/travler/dis_ati4.jpg">
                    <p>凯撒利亚</p>


                </div>

            </div>
            <div class="right" style="width: 290px;float: left;margin-left: 7px">

                <div class="m">
                    <font size="3px" color="grey">相关游记:</font><br>
                    <div class="demo1" style="padding-top:10px ">
                        <ul>
                            <a href="#">
                                <li>
                                    <div class="thumbnail">
                                        <img src="../../imgs/note/1.jpg" style="height: 190px;width:100%">
                                        <font size="3px" color="grey">超实用以色列攻略大全，多得是你不知道的事！</font><br>
                                        <span class="glyphicon glyphicon-eye-open" aria-hidden="true"
                                            style="color: gray"></span>
                                        <font size="2px" color="black">888</font>
                                    </div>

                                </li>
                            </a>
                            <a href="#">
                                <li>
                                    <div class="thumbnail">
                                        <img src="../../imgs/note/2.jpg" style="height: 190px;width:100%">
                                        <font size="3px" color="grey">超实用以色列攻略大全，多得是你不知道的事！</font><br>
                                        <span class="glyphicon glyphicon-eye-open" aria-hidden="true"
                                            style="color: gray"></span>
                                        <font size="2px" color="black">888</font>
                                    </div>

                                </li>
                            </a>
                            <a href="#">
                                <li>
                                    <div class="thumbnail">
                                        <img src="../../imgs/note/3.jpg" style="height: 190px;width:100%">
                                        <font size="3px" color="grey">超实用以色列攻略大全，多得是你不知道的事！</font><br>
                                        <span class="glyphicon glyphicon-eye-open" aria-hidden="true"
                                            style="color: gray"></span>
                                        <font size="2px" color="black">888</font>
                                    </div>

                                </li>
                            </a>
                            <a href="#">
                                <li>
                                    <div class="thumbnail">
                                        <img src="../../imgs/note/4.jpg" style="height: 190px;width:100%">
                                        <font size="3px" color="grey">超实用以色列攻略大全，多得是你不知道的事！</font><br>
                                        <span class="glyphicon glyphicon-eye-open" aria-hidden="true"
                                            style="color: gray"></span>
                                        <font size="2px" color="black">888</font>
                                    </div>

                                </li>
                            </a>
                            <a href="#"></a>
                            <li>
                                <div class="thumbnail">
                                    <img src="../../imgs/note/5.jpg" style="height: 190px;width:100%">
                                    <font size="3px" color="grey">超实用以色列攻略大全，多得是你不知道的事！</font><br>
                                    <span class="glyphicon glyphicon-eye-open" aria-hidden="true"
                                        style="color: gray"></span>
                                    <font size="2px" color="black">888</font>
                                </div>

                            </li>
                            </a>

                        </ul>
                    </div>
                </div>

                <!-- <div class="ce-nav" style="margin-top: 20px;border: 1px solid red">
                    <font size="3px" color="#ccc">游记目录:</font><br>
                    <ul id="sideul">
                        <a href="##">

                            <font size="2px" color="#ccc"><b>01/</b></font>
                            <li>
                                <font size="2px" color="#999"><b>出发！目的地：神秘中东古国以色列</b></font>
                            </li>
                        </a>
                        <a href="##">

                            <font size="2px" color="#ccc"><b>02/</b></font>
                            <li>
                                <font size="2px" color="#999"><b>君君的行程预告&旅行tips</b></font>
                            </li>
                        </a>
                        <a href="##">

                            <font size="2px" color="#ccc"><b>03/</b></font>
                            <li>
                                <font size="2px" color="#999"><b>Day1：学在旅途！古城风情体验之旅</b></font>
                            </li>
                        </a>
                        <a href="##">
                            <li>
                                <font size="2px" color="#ccc"><b>04/</b></font>
                                <font size="2px" color="#999"><b>Day2：沿历史脚步，感受传承的力量</b></font>
                            </li>
                        </a>
                        <a href="##">
                            <li>
                                <font size="2px" color="#ccc"><b>05/</b></font>
                                <font size="2px" color="#999"><b>END：学习·体验·成长</b></font>
                            </li>
                        </a>
                    </ul>
                </div> -->

            </div>


        </div>
    </div>

    <div class="container-fluid">
        <div class="row">

            <div class="commentAll" id="comment">
                <!--评论区域 begin-->
                <div class="reviewArea clearfix">
                    <textarea class="content comment-input" placeholder="Please enter a comment&hellip;"
                        onkeyup="keyUP(this)"></textarea>
                    <a href="javascript:;" class="plBtn">评论</a>
                </div>
                <!--评论区域 end-->
                <!--回复区域 begin-->
                <div class="comment-show">
                    <div class="comment-show-con clearfix">
                        <div class="comment-show-con-img pull-left"><img src="../../imgs/note/header-img-comment_03.png"
                                alt=""></div>
                        <div class="comment-show-con-list pull-left clearfix">
                            <div class="pl-text clearfix">
                                <a href="#" class="comment-size-name">张三 : </a>
                                <span class="my-pl-con">&nbsp;这篇文章好!</span>
                            </div>
                            <div class="pl-text clearfix">
                                <a href="#" class="comment-size-name">李四 : </a>
                                <span class="my-pl-con">&nbsp;这篇文章很好!</span>
                            </div>
                            <div class="date-dz">
                                <span class="date-dz-left pull-left comment-time">2017-5-2 11:11:39</span>
                                <div class="date-dz-right pull-right comment-pl-block">
                                    <a href="javascript:;" class="removeBlock">删除</a>
                                    <a href="javascript:;" class="date-dz-pl pl-hf hf-con-block pull-left">回复</a>
                                    <span class="pull-left date-dz-line">|</span>
                                    <a href="javascript:;" class="date-dz-z pull-left"><i
                                            class="date-dz-z-click-red"></i>赞 (<i class="z-num">666</i>)</a>
                                </div>
                            </div>
                            <div class="hf-list-con"></div>
                        </div>
                    </div>
                    <div class="comment-show-con clearfix">
                        <div class="comment-show-con-img pull-left"><img src="../../imgs/note/header-img-comment_03.png"
                                alt=""></div>
                        <div class="comment-show-con-list pull-left clearfix">

                            <div class="pl-text clearfix">
                                <a href="#" class="comment-size-name">李四 : </a>
                                <span class="my-pl-con">&nbsp;这篇文章很好!</span>
                            </div>
                            <div class="date-dz">
                                <span class="date-dz-left pull-left comment-time">2017-5-2 11:11:39</span>
                                <div class="date-dz-right pull-right comment-pl-block">
                                    <a href="javascript:;" class="removeBlock">删除</a>
                                    <a href="javascript:;" class="date-dz-pl pl-hf hf-con-block pull-left">回复</a>
                                    <span class="pull-left date-dz-line">|</span>
                                    <a href="javascript:;" class="date-dz-z pull-left"><i
                                            class="date-dz-z-click-red"></i>赞 (<i class="z-num">666</i>)</a>
                                </div>
                            </div>
                            <div class="hf-list-con"></div>
                        </div>
                    </div>
                </div>
                <!--回复区域 end-->
            </div>


        </div>
    </div>



    <!-- 底部导航 begin -->
    <div class="container-fluid" style="margin-top:20px; ">
        <div class="row">
            <nav class="navbar navbar-inverse fixed-bottom" role="navigation">
                <div class="container-fluid" style="font-size: 13px">
                    <div class="row">
                        <ul class="nav navbar-nav">
                            <li>
                                <div style="color: rgb(177, 177, 177);margin-top: 50px;margin-left: 150px"
                                    class="col-md-4">
                                    <h4>悠&nbsp;U旅行</h4>
                                    <p>悠&nbsp;U是一个新方式的<span style="color: bisque"> "旅行交友"</span> 的网站,<br>
                                        旨在帮助旅行者计划和结伴游玩,<br>
                                        可以提供业余的引路人带给旅行者更好的 <span style="color: bisque"> "游玩体验"</span><br>
                                        提供一定的旅行日记,打造 <span style="color: bisque">"新方式旅行交友"</span><br>
                                    </p>
                                </div>
                            </li>
                            <li>
                                <div style="color: rgb(177, 177, 177);margin-top: 50px;margin-left: 0px"
                                    class="col-md-12">
                                    <h4>关于我们</h4>
                                    <ul class="nav navbar-nav" style="list-style: none;margin-left: 0px">
                                        <li>关于悠 U</li>
                                        <li>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;联系我们</li><br>
                                        <li>服务协议</li>
                                        <li>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;游记协议</li><br>
                                        <li>达人协议</li>
                                        <li>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;隐私政策</li><br>
                                        <li>网络信息侵权通知指引</li><br>
                                        <li>网站地图</li>
                                        <li>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;商业合作</li><br>
                                        <li style="color: bisque">&nbsp;&nbsp;&nbsp;加入我们</li>

                                    </ul>
                            </li>
                            <li>
                                <div style="color: rgb(177, 177, 177);margin-top: 50px;margin-left: 180px"
                                    class="col-md-12">
                                    <h4>帮助中心</h4>
                                    <ul class="nav navbar-nav" style="list-style: none;margin-left: 0px">
                                        <li>新手上路</li><br>
                                        <li style="color: bisque">意见反馈</li>
                                        <li>&nbsp;&nbsp;&nbsp;&nbsp;常见问题</li><br>
                                        <li style="color: bisque">帮助中心</li>
                                        <li>&nbsp;&nbsp;&nbsp;&nbsp;旅行工具</li><br>
                                </div>
                            </li>
                        </ul>
                    </div>
                    <br><br>
                    <hr>
                    <div style="color: rgb(177, 177, 177);margin-top: 20px;margin-left: 150px;font-size: 12px">
                        <div style="float: left;"><img src="../../imgs/index/logo.jpg" width="60px" height="40px"
                                style="opacity: 0.7;border-radius: 80px;">
                        </div>
                        <div style="float: left;margin: 10px 5px;font-family: '楷体';font-size:18px">悠 U</div>
                        <div style="float: left;;margin-top: 10px;margin-left: 30px">© 2019 悠U
                            版权所有&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;经营许可&nbsp;&nbsp;&nbsp;营业执照</div>
                        <div style="clear: both;margin-left: 130px;margin-bottom: 20px">悠U不是旅行社,也不是代理商,我们只提供一些免费、客观、公正
                            、计费的攻略指南,以及一些业余的引路人
                            对外部网站概不负责</div>

                    </div>
                </div>
                <div
                    style="float: right;width: 40px;height: 50px;margin-right: 10px;background-color: aliceblue;text-align: center">
                    <a href="#top" style="color: rgb(177, 177, 177)"><br>Top&nbsp;↑</a>
                </div>
            </nav>

        </div>
    </div>

    <!-- 底部导航 end -->

    <!-- 评论 -->

    <script type="text/javascript" src="../../js/note/comment/jquery-1.12.0.min.js"></script>
    <script type="text/javascript" src="../../js/note/comment/jquery.flexText.js"></script>

    <!-- bootstrap中的js插件依赖于jquery框架,所以必须先引入jquery的js文件 -->
    <script src="../../plugins/jquery/jquery.min.js"></script>
    <!--引入bootstrap的js文件-->
    <script src="../../plugins/bootstrap/js/bootstrap.js"></script>

    <!-- 自定义js -->
    <script src="../../js/content.js?v=1.0.0"></script>
    <script src="../../js/index/lunbo.js"></script>

    <!-- 滚动显示相关游记 -->
    <script src="../../js/note/jcarousellite_1.0.1c4.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            $(".demo1").jCarouselLite({
                vertical: true,
                hoverPause: true,
                visible: 2,
                auto: 1000,
                speed: 1500
            });
        });
    </script>
    <!-- 评论 -start-->
    <!--textarea高度自适应-->
    <script type="text/javascript">
        $(function () {
            $('.content').flexText();
        });
    </script>
    <!--textarea限制字数-->
    <script type="text/javascript">
        function keyUP(t) {
            var len = $(t).val().length;
            if (len > 139) {
                $(t).val($(t).val().substring(0, 140));
            }
        }
    </script>
    <!--点击评论创建评论条-->
    <script type="text/javascript">
        $('.commentAll').on('click', '.plBtn', function () {
            var myDate = new Date();
            //获取当前年
            var year = myDate.getFullYear();
            //获取当前月
            var month = myDate.getMonth() + 1;
            //获取当前日
            var date = myDate.getDate();
            var h = myDate.getHours();       //获取当前小时数(0-23)
            var m = myDate.getMinutes();     //获取当前分钟数(0-59)
            if (m < 10) m = '0' + m;
            var s = myDate.getSeconds();
            if (s < 10) s = '0' + s;
            var now = year + '-' + month + "-" + date + " " + h + ':' + m + ":" + s;
            //获取输入内容
            var oSize = $(this).siblings('.flex-text-wrap').find('.comment-input').val();
            console.log(oSize);
            //动态创建评论模块
            oHtml = '<div class="comment-show-con clearfix"><div class="comment-show-con-img pull-left"><img src="../../imgs/note/header-img-comment_03.png" alt=""></div> <div class="comment-show-con-list pull-left clearfix"><div class="pl-text clearfix"> <a href="#" class="comment-size-name">David Beckham : </a> <span class="my-pl-con">&nbsp;' + oSize + '</span> </div> <div class="date-dz"> <span class="date-dz-left pull-left comment-time">' + now + '</span> <div class="date-dz-right pull-right comment-pl-block"><a href="javascript:;" class="removeBlock">删除</a> <a href="javascript:;" class="date-dz-pl pl-hf hf-con-block pull-left">回复</a> <span class="pull-left date-dz-line">|</span> <a href="javascript:;" class="date-dz-z pull-left"><i class="date-dz-z-click-red"></i>赞 (<i class="z-num">666</i>)</a> </div> </div><div class="hf-list-con"></div></div> </div>';
            if (oSize.replace(/(^\s*)|(\s*$)/g, "") != '') {
                $(this).parents('.reviewArea ').siblings('.comment-show').prepend(oHtml);
                $(this).siblings('.flex-text-wrap').find('.comment-input').prop('value', '').siblings('pre').find('span').text('');
            }
        });
    </script>
    <!--点击回复动态创建回复块-->
    <script type="text/javascript">
        $('.comment-show').on('click', '.pl-hf', function () {
            //获取回复人的名字
            var fhName = $(this).parents('.date-dz-right').parents('.date-dz').siblings('.pl-text').find('.comment-size-name').html();
            //回复@
            var fhN = '回复@' + fhName;
            //var oInput = $(this).parents('.date-dz-right').parents('.date-dz').siblings('.hf-con');
            var fhHtml = '<div class="hf-con pull-left"> <textarea class="content comment-input hf-input" placeholder="" onkeyup="keyUP(this)"></textarea> <a href="javascript:;" class="hf-pl">评论</a></div>';
            //显示回复
            if ($(this).is('.hf-con-block')) {
                $(this).parents('.date-dz-right').parents('.date-dz').append(fhHtml);
                $(this).removeClass('hf-con-block');
                $('.content').flexText();
                $(this).parents('.date-dz-right').siblings('.hf-con').find('.pre').css('padding', '6px 15px');
                //console.log($(this).parents('.date-dz-right').siblings('.hf-con').find('.pre'))
                //input框自动聚焦
                $(this).parents('.date-dz-right').siblings('.hf-con').find('.hf-input').val('').focus().val(fhN);
            } else {
                $(this).addClass('hf-con-block');
                $(this).parents('.date-dz-right').siblings('.hf-con').remove();
            }
        });
    </script>
    <!--评论回复块创建-->
    <script type="text/javascript">
        $('.comment-show').on('click', '.hf-pl', function () {
            var oThis = $(this);
            var myDate = new Date();
            //获取当前年
            var year = myDate.getFullYear();
            //获取当前月
            var month = myDate.getMonth() + 1;
            //获取当前日
            var date = myDate.getDate();
            var h = myDate.getHours();       //获取当前小时数(0-23)
            var m = myDate.getMinutes();     //获取当前分钟数(0-59)
            if (m < 10) m = '0' + m;
            var s = myDate.getSeconds();
            if (s < 10) s = '0' + s;
            var now = year + '-' + month + "-" + date + " " + h + ':' + m + ":" + s;
            //获取输入内容
            var oHfVal = $(this).siblings('.flex-text-wrap').find('.hf-input').val();
            console.log(oHfVal)
            var oHfName = $(this).parents('.hf-con').parents('.date-dz').siblings('.pl-text').find('.comment-size-name').html();
            var oAllVal = '回复@' + oHfName;
            if (oHfVal.replace(/^ +| +$/g, '') == '' || oHfVal == oAllVal) {

            } else {
                $.getJSON("/json/pl.json", function (data) {
                    var oAt = '';
                    var oHf = '';
                    $.each(data, function (n, v) {
                        delete v.hfContent;
                        delete v.atName;
                        var arr;
                        var ohfNameArr;
                        if (oHfVal.indexOf("@") == -1) {
                            data['atName'] = '';
                            data['hfContent'] = oHfVal;
                        } else {
                            arr = oHfVal.split(':');
                            ohfNameArr = arr[0].split('@');
                            data['hfContent'] = arr[1];
                            data['atName'] = ohfNameArr[1];
                        }

                        if (data.atName == '') {
                            oAt = data.hfContent;
                        } else {
                            oAt = '回复<a href="#" class="atName">@' + data.atName + '</a> : ' + data.hfContent;
                        }
                        oHf = data.hfName;
                    });

                    var oHtml = '<div class="all-pl-con"><div class="pl-text hfpl-text clearfix"><a href="#" class="comment-size-name">我的名字 : </a><span class="my-pl-con">' + oAt + '</span></div><div class="date-dz"> <span class="date-dz-left pull-left comment-time">' + now + '</span> <div class="date-dz-right pull-right comment-pl-block"> <a href="javascript:;" class="removeBlock">删除</a> <a href="javascript:;" class="date-dz-pl pl-hf hf-con-block pull-left">回复</a> <span class="pull-left date-dz-line">|</span> <a href="javascript:;" class="date-dz-z pull-left"><i class="date-dz-z-click-red"></i>赞 (<i class="z-num">666</i>)</a> </div> </div></div>';
                    oThis.parents('.hf-con').parents('.comment-show-con-list').find('.hf-list-con').css('display', 'block').prepend(oHtml) && oThis.parents('.hf-con').siblings('.date-dz-right').find('.pl-hf').addClass('hf-con-block') && oThis.parents('.hf-con').remove();
                });
            }
        });
    </script>
    <!--删除评论块-->
    <script type="text/javascript">
        $('.commentAll').on('click', '.removeBlock', function () {
            var oT = $(this).parents('.date-dz-right').parents('.date-dz').parents('.all-pl-con');
            if (oT.siblings('.all-pl-con').length >= 1) {
                oT.remove();
            } else {
                $(this).parents('.date-dz-right').parents('.date-dz').parents('.all-pl-con').parents('.hf-list-con').css('display', 'none')
                oT.remove();
            }
            $(this).parents('.date-dz-right').parents('.date-dz').parents('.comment-show-con-list').parents('.comment-show-con').remove();

        })
    </script>
    <!--点赞-->
    <script type="text/javascript">
        $('.comment-show').on('click', '.date-dz-z', function () {
            var zNum = $(this).find('.z-num').html();
            if ($(this).is('.date-dz-z-click')) {
                zNum--;
                $(this).removeClass('date-dz-z-click red');
                $(this).find('.z-num').html(zNum);
                $(this).find('.date-dz-z-click-red').removeClass('red');
            } else {
                zNum++;
                $(this).addClass('date-dz-z-click');
                $(this).find('.z-num').html(zNum);
                $(this).find('.date-dz-z-click-red').addClass('red');
            }
        })
    </script>
    <!-- 评论 -end-->
</body>

</html>